<template>
    <div>
      <el-table :data="orders" style="width: 100%" >
        <el-table-column prop="orderId" label="订单编号" width="60" align="center">
        </el-table-column>
        <el-table-column prop="time" label="日期" width="220" align="center">
        </el-table-column>
        <el-table-column label="商户信息">
            <el-table-column prop="merchat.merName" label="商户名" width="150" align="center">
            </el-table-column>
            <el-table-column prop="merchat.merImg" label="商户头像" width="130"  align="center">
              <template slot-scope="scope">
                <img :src="scope.row.merchat.merImg" style="width: 50px; height: 50px">
              </template>
            </el-table-column>
        </el-table-column>
        <el-table-column label="配送信息">
          <el-table-column prop="totalPrice" label="总价" width="100" align="center">
          </el-table-column>
          <el-table-column label="配送地址">
            <el-table-column prop="address.region" label="市区" width="150" align="center">
            </el-table-column>
            <el-table-column prop="address.street" label="街道" width="150" align="center">
            </el-table-column>
            <el-table-column prop="address.detailAddress" label="详细地址" width="214"  align="center">
            </el-table-column>
            <el-table-column label="订单状态" width="120">
              <template slot-scope="orders">
  
                <span v-if="orders.row.status == 0">
                  <el-button  type="success" style="width: 90px" round>配送中</el-button>
                </span>
                <span v-if="orders.row.status == 1">
                  <el-button  type="info" style="width: 90px" round>已送达</el-button>
                </span>
  
              </template>
            </el-table-column>
            
          </el-table-column>
        </el-table-column>
  
      </el-table>
      <!-- <el-pagination
          @size-change="sizeData"
          @current-change="pageData"
          :page-sizes="[5,10,20,30,60]"
          :page-size="10"
          layout="total, sizes, prev, pager, next, jumper"
          :total="count">
        </el-pagination> -->
    </div>
  </template>
  
  <script>
  import userApi from "@/api/apiPb/User_order";
  export default {
  
    data() {
      return {
        userId: 1,
        orders: [],
      }
    },
    created() {
      this.userId=this.$route.query.userId;
      this.fetchData();
    },
  
    methods: {
      fetchData() {
        //查询用户所有Order信息
        userApi.getOrdersList(this.userId)
          .then(response => {
          this.orders = response.data.data
          // console.log(this.orders);
        })
      },
    },
  
  
  }
  </script>